const path = require("path");
// module.exports = {
//   assetsDir: 'static',
//   // 指定`build`时,在静态文件上一层添加static目录
//   configureWebpack: {
//       externals: {
//           'vue': 'Vue',
//           'element-ui': 'ELEMENT'    // 注意大写
//       }
//   }
// };

const Version = new Date().getTime()

function resolve(dir) {
  return path.join(__dirname, "./", dir);
}

module.exports = {
  publicPath: "/", // 基本路径,打包时加上.

  // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
  // webpack配置
  chainWebpack: (config) => {
    // config
    //   .plugin('webpack-bundle-analyzer')
    //   .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
    config.resolve.symlinks(true);
    config.plugin("html").tap((args) => {
      // 修复 Lazy loading routes Error
      args[0].chunksSortMode = "none";
      return args;
    });

    // svg rule loader
    const svgRule = config.module.rule("svg"); // 找到svg-loader
    svgRule.uses.clear(); // 清除已有的loader, 如果不这样做会添加在此loader之后
    svgRule.exclude.add(/node_modules/); // 正则匹配排除node_modules目录
    svgRule // 添加svg新的loader处理
      .test(/\.svg$/)
      .use("svg-sprite-loader")
      .loader("svg-sprite-loader")
      .options({
        symbolId: "icon-[name]",
      });

    // 修改images loader 添加svg处理
    const imagesRule = config.module.rule("images");
    imagesRule.exclude.add(resolve("src/assets/icons"));
    config.module.rule("images").test(/\.(png|jpe?g|gif|svg)(\?.*)?$/);

  },
  configureWebpack: (config) => {
    // if (process.env.VUE_APP_MODE === 'production') {
    //   // 为生产环境修改配置...
    //   config.mode = 'production'
    // } else {
    //   // 为开发环境修改配置...
    //   config.mode = 'development'
    // }
    Object.assign(config, {
      // 开发生产共同配置
      resolve: {
        alias: {
          "@": path.resolve(__dirname, "./src"),
          "@cm": path.resolve(__dirname, "./src/components_modules"),
          "@p": path.resolve(__dirname, "./src/views"),
          "@u": path.resolve(__dirname, "./src/util"),
          "@a": path.resolve(__dirname, "./src/api"),
          "@c": path.resolve(__dirname, "./src/components"),
        }, // 别名配置
      },
      output: { // 输出重构  打包编译后的 文件名称  【模块名称.版本号.时间戳】
        ...config.output,
        filename: `static/js/[name].${Version}.js`,
        chunkFilename: `static/js/[name].${Version}.js`
      }
      // externals: {
      //   // 'vue': 'Vue',
      //   "echarts": "echarts",
      //   // 'element-ui': 'ELEMENT',
      //   'wangeditor': 'wangeditor',
      //   // 'lodash': '_',
      // }
    });
    
  },
  productionSourceMap: false, // 生产环境是否生成 sourceMap 文件
  // css相关配置
  css: {
    // extract: true, // 是否使用css分离插件 ExtractTextPlugin
    sourceMap: false, // 开启 CSS source maps?
    loaderOptions: {
      css: {}, // 这里的选项会传递给 css-loader
      postcss: {
        plugins: [],
      },
    },
    loaderOptions: {
      less: {
        // `globalVars` 定义全局对象，可加入全局变量
      },
    },
    // extract: {
    //   // 修改打包后css文件名
    //   filename: `css/[name].${Version}.css`,
    //   chunkFilename: `css/[name].${Version}.css`
    // },
    requireModuleExtension: true,
  },
  parallel: require("os").cpus().length > 1, // 是否为 Babel 或 TypeScript 使用 thread-loader。该选项在系统的 CPU 有多于一个内核时自动启用，仅作用于生产构建。

  devServer: {
    compress: true,
    contentBase: "./", //项目基本访问目录
    disableHostCheck: true,
    hotOnly: true, // 热更新
    open: true, // 自动打开浏览器
    host: "localhost",
    port: 9090, // 端口
    https: false, // 启用https
    overlay: {
      warnings: true,
      errors: true,
    }, 
    // proxy: {
    //   "/api": {
    //     target: process.env.VUE_APP_HTTP,
    //     secure: false, // false为http访问，true为https访问
    //     changeOrigin: true,
    //     pathRewrite: {
    //       "^/getkeyapi": "",
    //     },
    //   },
    // },
  },
  // 第三方插件配置
  pluginOptions: {},
};
